<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>center</title>

    <link rel="stylesheet" href="../../css/user/center.css" type="text/css">
    <!-- 引入bootstrap框架的样式文件 -->
    <link rel="stylesheet" href="../../plugins/bootstrap/css/bootstrap.css" type="text/css">
    <link rel="stylesheet" href="../../plugins/layui/css/layui.css" type="text/css">
    <link rel="stylesheet" href="../../css/services/serviceDetail.css" type="text/css">

    <!-- 引入layui框架的样式文件 -->
    <%--<link href="../../plugins/layui/css/layui.css" rel="stylesheet">--%>
    <%--<link href="../../plugins/layui/layui.js" rel="stylesheet">--%>


</head>


<body style="background-color: #f3f3f4">
<!-- 个人中心第一层导航栏 -->

<%@ include file="../common/nav.jsp"%>

<div>


    <!-- 第三层banner图片 - begin -->
    <div>
        <img id="banner" src="../imgs/usercenter-banner.png" alt="图片加载失败!">
    </div>
    <!-- 第三层banner图片 - end -->

    <!-- 第六层个人信息展示 - begin -->
    <div>
        <h2 class="sixth-header" style="margin-top: 30px">关于我</h2>
        <h4 class="sixth-header">About me</h4>
        <div id="sixth-middle">
            <a href="#">
                <div id="sixth-bottom">
                    <img id="sixth-picture" src="${picture.path}" alt="图片加载失败!">
                </div>
            </a>
            <div id="sixth-intro">
                <h3 style="margin-top: 20px">${userinfo.name}</h3><br>

                <c:if test="${realName.status == 0}">
                    <p>[是否实名]:未实名</p>
                </c:if>
                <c:if test="${realName.status == 1}">
                    <p>[是否实名]:${realName.sname}</p>
                </c:if>

                <c:forEach items="${address}" var="a">
                    <c:if test="${a.isDefault == 1 && a.dataFlag == 1}">
                        <p>[默认地址]:${a.provinceName}${a.cityName}${a.areaName}${a.addressDeatil}</p>
                    </c:if>
                </c:forEach>


                <p>联系方式:${userinfo.telNumber}</p>
                <c:if test="${userinfo.grade == 1}">
                    <p>等级:<span class="glyphicon glyphicon-star" style="color: #FFB800;font-size: 15px;margin-left: 5px"></span></p>
                </c:if>
                <c:if test="${userinfo.grade == 3}">
                    <p>等级:<span class="glyphicon glyphicon-star" style="color: #FFB800;font-size: 15px;margin-left: 5px"></span><span class="glyphicon glyphicon-star" style="color: #FFB800;font-size: 15px"></span><span class="glyphicon glyphicon-star" style="color: #FFB800;font-size: 15px"></span></p>
                </c:if>
                <c:if test="${userinfo.grade == 5}">
                    <p>等级:<span class="glyphicon glyphicon-star" style="color: #FFB800;font-size: 15px;margin-left: 5px">
                    <span class="glyphicon glyphicon-star" style="color: #FFB800;font-size: 15px"></span>
                    <span class="glyphicon glyphicon-star" style="color: #FFB800;font-size: 15px"></span>
                    <span class="glyphicon glyphicon-star" style="color: #FFB800;font-size: 15px"></span>
                    <span class="glyphicon glyphicon-star" style="color: #FFB800;font-size: 15px"></span>
                </span></p>
                </c:if>

            </div>

        </div>


    </div>
    <!-- 第六层个人信息展示 - end -->

    <!-- 第七层评价展示 - begin -->
    <div id="seventh">
        <h2 class="seventh-header">服务评价</h2>
        <h4 class="seventh-header">Customer evaluation</h4>

        <div id="seventh-content">
            <%--<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief"--%>
            <%--style="margin-left: 30px;margin-right: 30px">--%>
            <%--<ul class="layui-tab-title">--%>
            <%--<li class="layui-this" id="third-1">全部</li>--%>
            <%--<li>好评<span class="seventh-number">99+</span></li>--%>
            <%--<li>中评<span class="seventh-number">23</span></li>--%>
            <%--<li>差评<span class="seventh-number">87</span></li>--%>
            <%--</ul>--%>
            <%--</div>--%>
            <c:forEach items="${requestScope.commentList}" var="com" >

                <div class="seventh-evaluate" style="margin-top: 20px">
                    <img class="seventh-picture" src="../imgs/index_head.PNG" alt="图片加载失败!">
                    <c:forEach items="${requestScope.userInfos}" var="u">
                        <c:if test="${com.userinfoId==u.id}">
                            <p class="seventh-muted" style="margin-top:10px;"><a>&nbsp;&nbsp;&nbsp;${u.name}</a></p>
                        </c:if>
                    </c:forEach>
                    <p><span class="seventh-star" class="glyphicon glyphicon-star"></span></p>
                    <p class="seventh-date">&nbsp;&nbsp;&nbsp;${com.time}来自 ipone X</p><br>
                    <p style="margin-top: 5px;">${com.content}</p>
                    <div class="comment-btn">
                            <%--<a href="${path}/praise?id=${com.id}">--%>
                        <c:if test="${!empty sessionScope.userId}">
                            <button type="button" class="layui-btn layui-btn-xs layui-btn-warm" id="cs" onclick="onClick(${com.id})">

                                                    <span class="layui-icon layui-icon-praise" style="font-size: 12px">点赞
                                                    </span>
                            </button>
                        </c:if>
                        <c:if test="${empty sessionScope.userId}">
                            <button type="button" class="layui-btn layui-btn-xs layui-btn-warm" id="cs" onclick="onClick1(${com.id})">

                                                    <span class="layui-icon layui-icon-praise" style="font-size: 12px">点赞
                                                    </span>
                            </button>
                        </c:if>
                            <%--</a>--%>
                        <span id="span${com.id}">
                                                &nbsp;&nbsp;${com.counts}
                                                        </span>


                    </div>
                    <div class="comment-btn">
                        <button type="button" class="layui-btn layui-btn-xs layui-btn-warm" id="xianshi">
                                            <span class="layui-icon layui-icon-reply-fill "
                                                  style="font-size: 12px">评论</span>
                        </button>

                    </div>

                </div>

            </c:forEach>

            
        </div>

        <!-- 第七层评价展示 - end -->

        <!-- 第八层服务提供展示 - begin -->
        <div style="overflow: hidden">
            <h2 class="eighth-header">服务提供</h2>
            <h4 class="eighth-header-2">Published services</h4>

            <div class="eighth-context">
                <a href="javascript:go8()"><img class="eighth-picture" src="../imgs/xnh.jpg" alt="图片加载失败!"></a>
                <p class="eighth-money"> ¥5000.00/天</p>
                <p class="eighth-people">100人预约</p>
                <p class="eighth-play">陪玩游戏/陪玩象棋/陪人聊天</p>
                <p class="eighth-name">李雨昂</p>
                <p class="eighth-address">江苏省苏州市</p>
            </div>
        </div>
    </div>

    <%@ include file="../common/footer.jsp"%>



    <!-- bootstrap中的js插件依赖于jquery框架,所以必须先引入jquery的js文件 -->
    <script src="../../plugins/jquery/jquery.min.js"></script>
    <!--引入bootstrap的js文件-->
    <script src="../../plugins/bootstrap/js/bootstrap.js"></script>
    <script>
        function mit(content){
            var cm = document.getElementById("an").value;

            window.location = "${pageContext.request.contextPath}/center/addanswer?cm="+cm;

        }
    </script>
    <script>
        function onClick(id) {        //点赞功能
            $.ajax({
                url:"${path}/praise",	// 请求后台方法。
                type:"get",	// 请求方式
                async:true, //异步
                data:{
                    id:id

                    //  传入数据
                },
                success:function(data){
                    var a = parseInt($("#span"+id).text())+1;


                    $("#span"+id).text(a);

                },
                error:function(){
                    alert("网络错误，请重试 ！！");
                }
            });
        }

        function Pra(id) {
            $.ajax({
                url:"${path}/anpraise",	// 请求后台方法。
                type:"get",	// 请求方式
                data:{
                    id:id
                    //  传入数据
                },
                success:function(data){
                    var a = parseInt($("#aspan"+id).text())+1;

                    $("#aspan"+id).text(a);



                },
                error:function(){
                    alert("网络错误，请重试 ！！");
                }
            });
        }
    </script>

    <script>
        $(document).ready(function(){
            $("#xianshi").click(function(){
                $("#huifu").toggle();
            });
        });
    </script>

    <script>
        function serviceDetail(id) {
            var serviceId = id;
            alert(serviceId);
            $.ajax({
                //提交数据的类型 POST GET
                type: "GET",
                //提交的网址
                url: "/center/list",
                //提交的数据
                data: {id: serviceId},
                dataType: 'json',
                //参数格式为json
                // contentType: "application/json; charset=utf-8",
                //返回数据的格式
                // datatype: "json",//"xml", "html", "script", "json", "jsonp", "text".
                //成功返回之后调用的函数
                success: function () {
                    window.location = '/comment/people'
                },
                //调用出错执行的函数
                error: function () {
                    //请求出错处理
                    alert("请求失败");
                }
            })
        }
    </script>

</body>

</html>
